<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>DisableDevtool 拦截器测试页面</title>
    <style>
        body {
            font-family: 'Segoe UI', Arial, sans-serif;
            max-width: 800px;
            margin: 0 auto;
            padding: 20px;
            line-height: 1.6;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            min-height: 100vh;
        }
        .container {
            background: rgba(255, 255, 255, 0.1);
            padding: 30px;
            border-radius: 15px;
            backdrop-filter: blur(10px);
            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
        }
        h1 {
            text-align: center;
            margin-bottom: 30px;
            font-size: 2.5em;
        }
        .test-section {
            background: rgba(255, 255, 255, 0.1);
            padding: 20px;
            margin: 20px 0;
            border-radius: 10px;
            border-left: 4px solid #4CAF50;
        }
        .test-button {
            background: #4CAF50;
            color: white;
            border: none;
            padding: 12px 24px;
            border-radius: 6px;
            cursor: pointer;
            font-size: 16px;
            margin: 10px 5px;
            transition: background 0.3s;
        }
        .test-button:hover {
            background: #45a049;
        }
        .danger-button {
            background: #f44336;
        }
        .danger-button:hover {
            background: #da190b;
        }
        .status {
            padding: 10px;
            margin: 10px 0;
            border-radius: 5px;
            background: rgba(255, 255, 255, 0.2);
        }
        code {
            background: rgba(0, 0, 0, 0.3);
            padding: 2px 6px;
            border-radius: 3px;
            font-family: 'Courier New', monospace;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>🛡️ DisableDevtool 拦截器测试</h1>
        
        <div class="test-section">
            <h3>📋 测试说明</h3>
            <p>这个页面用于测试 DisableDevtool 万能拦截器的功能。如果拦截器正常工作，你应该能看到：</p>
            <ul>
                <li>右上角显示绿色状态指示器</li>
                <li>开发者工具可以正常打开和使用</li>
                <li>控制台中显示拦截日志</li>
            </ul>
        </div>

        <div class="test-section">
            <h3>🧪 功能测试</h3>
            <button class="test-button" onclick="testDevTools()">测试开发者工具</button>
            <button class="test-button" onclick="testConsole()">测试控制台</button>
            <button class="test-button" onclick="checkInterceptor()">检查拦截器状态</button>
            <div id="test-results" class="status" style="display:none;"></div>
        </div>

        <div class="test-section">
            <h3>⚠️ 模拟反调试脚本</h3>
            <p>以下按钮会模拟加载反调试脚本，用于测试拦截功能：</p>
            <button class="test-button danger-button" onclick="simulateDisableDevtool()">模拟 DisableDevtool</button>
            <button class="test-button danger-button" onclick="simulateInlineScript()">模拟内联反调试脚本</button>
            <button class="test-button danger-button" onclick="simulateExternalScript()">模拟外部反调试脚本</button>
            <div id="simulation-results" class="status" style="display:none;"></div>
        </div>

        <div class="test-section">
            <h3>📊 使用指南</h3>
            <ol>
                <li>确保已安装 Tampermonkey 或 Greasemonkey 浏览器扩展</li>
                <li>安装 DisableDevtool 万能拦截器脚本</li>
                <li>刷新此页面</li>
                <li>观察右上角是否出现状态指示器</li>
                <li>按 <code>F12</code> 测试开发者工具是否可用</li>
                <li>点击上方按钮进行功能测试</li>
            </ol>
        </div>

        <div class="test-section">
            <h3>🔗 相关链接</h3>
            <ul>
                <li><a href="https://github.com/MissChina/anti-disable-devtool" style="color: #87ceeb;">GitHub 项目页面</a></li>
                <li><a href="https://www.tampermonkey.net/" style="color: #87ceeb;">Tampermonkey 官网</a></li>
                <li><a href="https://greasyfork.org/" style="color: #87ceeb;">Greasy Fork 脚本库</a></li>
            </ul>
        </div>
    </div>

    <script>
        function testDevTools() {
            const results = document.getElementById('test-results');
            results.style.display = 'block';
            
            try {
                // 测试控制台
                const consoleAvailable = typeof console !== 'undefined' && typeof console.log === 'function';
                
                // 测试开发者工具检测
                let devtoolsOpen = false;
                const threshold = 160;
                
                if (window.outerHeight - window.innerHeight > threshold || 
                    window.outerWidth - window.innerWidth > threshold) {
                    devtoolsOpen = true;
                }
                
                let resultHtml = '<h4>测试结果：</h4>';
                resultHtml += `<p>✅ 控制台可用: ${consoleAvailable ? '是' : '否'}</p>`;
                resultHtml += `<p>📏 开发者工具状态: ${devtoolsOpen ? '可能已打开' : '未检测到'}</p>`;
                resultHtml += `<p>🛡️ 拦截器保护: 正常</p>`;
                
                results.innerHTML = resultHtml;
                console.log('🛡️ 开发者工具测试完成');
            } catch (e) {
                results.innerHTML = `<p>❌ 测试出错: ${e.message}</p>`;
            }
        }

        function testConsole() {
            try {
                console.log('🧪 控制台功能测试');
                console.warn('这是一条警告信息');
                console.error('这是一条错误信息（测试用）');
                console.info('这是一条信息');
                console.table([{名称: '测试', 状态: '通过'}, {名称: '拦截器', 状态: '正常'}]);
                
                const results = document.getElementById('test-results');
                results.style.display = 'block';
                results.innerHTML = '<h4>控制台测试：</h4><p>✅ 控制台功能正常，请查看开发者工具控制台面板</p>';
            } catch (e) {
                const results = document.getElementById('test-results');
                results.style.display = 'block';
                results.innerHTML = `<h4>控制台测试：</h4><p>❌ 控制台被禁用: ${e.message}</p>`;
            }
        }

        function checkInterceptor() {
            const results = document.getElementById('test-results');
            results.style.display = 'block';
            
            // 检查是否存在 DisableDevtool 全局保护
            let interceptorStatus = 'unknown';
            try {
                if (typeof window.DisableDevtool === 'function') {
                    const result = window.DisableDevtool();
                    if (result && result.reason && result.reason.includes('interceptor')) {
                        interceptorStatus = 'active';
                    }
                }
            } catch (e) {
                interceptorStatus = 'error';
            }
            
            // 检查状态面板是否存在
            const statusPanel = document.querySelector('div[style*="position: fixed"][style*="top: 15px"]');
            const panelExists = statusPanel !== null;
            
            let resultHtml = '<h4>拦截器状态检查：</h4>';
            resultHtml += `<p>🛡️ 全局保护: ${interceptorStatus === 'active' ? '已激活' : '状态未知'}</p>`;
            resultHtml += `<p>📊 状态面板: ${panelExists ? '已显示' : '未找到'}</p>`;
            resultHtml += `<p>🌐 页面保护: 正常运行</p>`;
            
            results.innerHTML = resultHtml;
            console.log('🛡️ 拦截器状态检查完成');
        }

        function simulateDisableDevtool() {
            const results = document.getElementById('simulation-results');
            results.style.display = 'block';
            
            try {
                // 尝试创建 DisableDevtool 对象
                const testScript = document.createElement('script');
                testScript.textContent = `
                    // 模拟 DisableDevtool 特征代码
                    var DisableDevtool = {
                        detectors: ['RegToString', 'FuncToString'],
                        ondevtoolopen: function() {
                            console.log('检测到开发者工具');
                        },
                        clearIntervalWhenDevOpenTrigger: true
                    };
                `;
                
                document.head.appendChild(testScript);
                
                results.innerHTML = '<h4>模拟结果：</h4><p>🧪 已尝试加载模拟的 DisableDevtool 脚本，请查看拦截器是否生效</p>';
                console.log('🧪 模拟 DisableDevtool 脚本加载');
            } catch (e) {
                results.innerHTML = `<h4>模拟结果：</h4><p>❌ 模拟失败: ${e.message}</p>`;
            }
        }

        function simulateInlineScript() {
            const results = document.getElementById('simulation-results');
            results.style.display = 'block';
            
            try {
                const testScript = document.createElement('script');
                // 包含多个检测特征的内联脚本
                testScript.textContent = `
                    // 模拟反调试内联脚本
                    (function() {
                        var DisableDevtool = function() {
                            var detectors = ['RegToString', 'FuncToString'];
                            function ondevtoolopen() { /* 反调试逻辑 */ }
                            var clearIntervalWhenDevOpenTrigger = true;
                        };
                        window.antiDebug = DisableDevtool;
                    })();
                `;
                
                document.head.appendChild(testScript);
                results.innerHTML = '<h4>模拟结果：</h4><p>🧪 已创建包含反调试特征的内联脚本</p>';
                console.log('🧪 模拟内联反调试脚本');
            } catch (e) {
                results.innerHTML = `<h4>模拟结果：</h4><p>❌ 模拟失败: ${e.message}</p>`;
            }
        }

        function simulateExternalScript() {
            const results = document.getElementById('simulation-results');
            results.style.display = 'block';
            
            try {
                const testScript = document.createElement('script');
                // 模拟外部反调试脚本的URL
                testScript.src = 'https://cdn.jsdelivr.net/npm/disable-devtool@latest/disable-devtool.min.js';
                
                testScript.onerror = function() {
                    console.log('🧪 模拟外部脚本加载失败（这是正常的，因为我们只是测试拦截功能）');
                };
                
                document.head.appendChild(testScript);
                results.innerHTML = '<h4>模拟结果：</h4><p>🧪 已尝试加载外部反调试脚本，请观察拦截器反应</p>';
                console.log('🧪 模拟外部反调试脚本加载');
            } catch (e) {
                results.innerHTML = `<h4>模拟结果：</h4><p>❌ 模拟失败: ${e.message}</p>`;
            }
        }

        // 页面加载完成后的初始化
        document.addEventListener('DOMContentLoaded', function() {
            console.log('🧪 DisableDevtool 拦截器测试页面已加载');
            console.log('📋 请按 F12 打开开发者工具进行测试');
            
            // 检查是否有拦截器运行
            setTimeout(function() {
                const statusPanel = document.querySelector('div[style*="position: fixed"]');
                if (statusPanel) {
                    console.log('✅ 检测到拦截器状态面板');
                } else {
                    console.log('⚠️ 未检测到拦截器状态面板，请确认脚本是否正确安装');
                }
            }, 1000);
        });
    </script>
</body>
</html>